<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link href="stylesheets/css1.css" rel="stylesheet">
    <link href="stylesheets/css2.css" rel="stylesheet">
    <link rel="stylesheet" href="stylesheets/css3.css" />
    <link href="stylesheets/css4.css" type="text/css" rel="stylesheet" />
    <script src="javascripts/jquery-2.1.1.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        var jq211 = $.noConflict(true);
    </script>


</head>
<body>
    <span id="spanone"></span>
<div id="div1">
  <div id="div2">
    <img src="images/logo.jpg" id="pic1">
  </div>
    <div id="span1">SISELA</div>
</div>
<div id="div5">登陆/注册</div>
    <div class="menu-container">
        <menu>
            <menuitem onclick="window.location('index.html')">
                排行榜
            </menuitem>
            <menuitem onclick="window.location('2.html')">
                原谅系列
            </menuitem>
            <menuitem onclick="window.location('3.html')">
                姚明
            </menuitem>
            <menuitem onclick="window.location('4.html')">
                张学友
            </menuitem>
            <menuitem onclick="window.location('5.html')">
                熊本熊
            </menuitem>
            <menuitem onclick="window.location('6.html')">
                动物
            </menuitem>
            <menuitem onclick="window.location('7.html')">
                金馆长
            </menuitem>
            <menuitem onclick="window.location('8.html')">
                我的收藏
            </menuitem>
        </menu>
        <div class="sliding-bar"></div>

    </div>

<script  type="text/javascript">
    jq211(window).ready(function(){
        initMenu();
    });

    jq211('menuitem').hover(function(){
        var offset = jq211(this).offset();
        jq211('.sliding-bar').offset(offset);
    });

    jq211('menu').hover(function(){
        jq211('.sliding-bar').css({opacity:1});
    },function(){
        jq211('.sliding-bar').css({opacity:0});
    })


    var initMenu = function () {
        var $initElem = jq211('menuitem:first-of-type');
        var initOffset = $initElem.offset();
        var initSize = {
            width: $initElem.css('width'),
            height: $initElem.css('height')
        }
        jq211('.sliding-bar')
            .offset(initOffset)
            .css(initSize)
    }

</script>

<div id="div7">
    <div id="gallery-container">
        <ul class="items--small">
            <li class="item"><a  href="images/熊本熊/b1.jpg"><img src="images/熊本熊/s1.png" alt="" /></a></li>
            <!--<li class="item"><a  href="src/熊本熊/b2.jpg"><img src="src/熊本熊/s2.png" alt="" /></a></li>
            <li class="item"><a  href="src/熊本熊/b3.jpg"><img src="src/熊本熊/s3.png" alt="" /></a></li>
            <li class="item"><a  href="src/熊本熊/b4.jpg"><img src="src/熊本熊/s4.png" alt="" /></a></li>
            <li class="item"><a  href="src/熊本熊/b5.jpg"><img src="src/熊本熊/s5.png" alt="" /></a></li>
            <li class="item"><a  href="src/熊本熊/b6.jpg"><img src="src/熊本熊/s6.png" alt="" /></a></li>
            <li class="item"><a  href="src/熊本熊/b7.jpg"><img src="src/熊本熊/s7.png" alt="" /></a></li>
            <li class="item"><a  href="src/熊本熊/b8.jpg"><img src="src/熊本熊/s8.png" alt="" /></a></li>
            <li class="item"><a  href="src/熊本熊/b9.jpg"><img src="src/熊本熊/s9.png" alt="" /></a></li>
            <li class="item"><a  href="src/熊本熊/b10.jpg"><img src="src/熊本熊/s10.png" alt="" /></a></li>
            <li class="item"><a  href="src/熊本熊/b11.jpg"><img src="src/熊本熊/s11.png" alt="" /></a></li>
            <li class="item"><a  href="src/熊本熊/b12.jpg"><img src="src/熊本熊/s12.png" alt="" /></a></li>
            <li class="item"><a  href="src/熊本熊/b13.jpg"><img src="src/熊本熊/s13.png" alt="" /></a></li>
            <li class="item"><a  href="src/熊本熊/b14.jpg"><img src="src/熊本熊/s14.png" alt="" /></a></li>
            <li class="item"><a  href="src/熊本熊/b15.jpg"><img src="src/熊本熊/s15.png" alt="" /></a></li>
            <li class="item"><a  href="src/熊本熊/b16.jpg"><img src="src/熊本熊/s16.png" alt="" /></a></li>-->
        </ul>
    </div>
</div>

<div id="div3">
    &copy;  SISELA <a href="HOME.SISE.CN/" target="_blank" title="SISELA">SISELA</a> - Collect from <a href="HOME.SISE.CN/" title="SISELA" target="_blank">SISELA</a>
</div>
</body>
<style>
    .item{
        width: 100px;
        height: 100px;
    }
</style>
</html>